/**
 * @param {DOM} el 需要做动画的dom元素
 * @param {Number} target 动画的目标距离
 */
function animate(el,target){
    if (el.timer){
        clearInterval(el.timer)//放置重复设定定时器，如果有上一个定时器，那么就清除
    }
    //获取初始的盒子位置
    let leader=el.offsetLeft;
    //把定时器加在el上面
    el.timer=setInterval(()=>{
        let step=20;
        //setInter中要传入函数，函数需要调用，调用的时候会生成一个执行环境
        step=target<leader?-step:step;
        leader=leader+step
        //用leader-target,如果最后不满一个step,那么手动的将元素放到目标位置
        if(Math.abs(leader-target)>Math.abs(step)){
            el.style.left=leader+'px'//没到达目标，让盒子运动
        }else{
            el.style.left=target+'px'
            clearInterval(el.timer)//到达目标距离，清除定时器
        }
    },16);
}